<template>
  <Modal class="w-2/5" title="修改密码">
    <BaseForm />
  </Modal>
</template>

<script setup lang="ts">
defineOptions({
  name: 'PasswordModel',
});

import { ref, reactive, onMounted } from 'vue';
import { passwordFormSchema } from '../data/options';
import { resetPwdByOldPwd } from '../data/api';
import { useVbenModal } from '@vben/common-ui';
import { useThrottleFn } from '@vueuse/core';
import { useVbenForm } from '#/adapter/form';
import { message } from 'ant-design-vue';
import { useAuthStore } from '#/store';
const authStore = useAuthStore();

const props = defineProps({
  modelValue: {
    type: String,
    default: '',
  },
});

//  提交
const onSubmit = useThrottleFn(async (values: Record<string, any>) => {
  const { valid } = await formApi.validate();
  if (!valid) return;
  let res: any = await resetPwdByOldPwd({ ...values });
  console.log(res);
  message.success(res.message);
  modalApi.close();
  await authStore.logout(false);
}, 1000);

// 表单
const [BaseForm, formApi] = useVbenForm({
  // 所有表单项共用，可单独在表单内覆盖
  showDefaultActions: false,
  wrapperClass: 'pl-0 pr-4 pt-4 pb-4',
  schema: passwordFormSchema,
  handleSubmit: onSubmit,
  // 所有表单项
  commonConfig: {
    componentProps: {
      class: 'w-full',
    },
  },
});

const [Modal, modalApi] = useVbenModal({
  draggable: true,
  onConfirm: () => formApi.submitForm(),
});

// 打开弹窗
const open = () => {
  modalApi.open();
};

defineExpose({
  open,
});
</script>

<style lang="scss" scoped></style>
